<template>
	<view>
		<!-- 自定义导航栏 -->
		<uniBavBar dark :fixed="true" shadow background-color="#FFFFFF" color="#000000" status-bar left-icon="left"
			rightText="发布" @clickLeft="back" @clickRight="submit" >

			<!-- 默认插槽 -->
			<template #default>
				<view class="u-f-juc u-f-ac" style="flex: 1;" @tap="changelook">
					<text>{{changelookArr[yinshi]}}</text>
					<text class="icon iconfont icon-arrow-down-s-line"></text>
				</view>
			</template>

		</uniBavBar>
	</view>
	<!-- 多行文本域 -->
	<view class="uni-textarea">
		<textarea placeholder="说一说~" v-model="text" />
	</view>
	<!-- 上传图片 -->
	<uploadImages @upload="upload"/>
	<!-- 普通弹窗 -->
	<uni-popup  ref="popup" background-color="#FFF" :isMaskClick="false" @change="change">
		<view class="popup-content">
			<image src="../../static/logo.png" mode="widthFix"></image>
			<view class="popup-texts">
				<text>1. 涉及黄色,政治,广告及骚扰信息</text>
				<text>2. 涉及人身攻击</text>
				<text>3. 留联系方式,透露他人隐私</text>
				<text>一经核实将被封禁,情节严重者永久封禁</text>
			</view>
				<button type="warn" @tap="popup.close()">朕知道了</button>
		</view>
	</uni-popup>
	
</template>

<script setup>
	import uniBavBar from '../../component/uni-nav-bar/uni-nav-bar.vue';
	import uploadImages from '../../component/common/upload-images.vue';
	import uniPopup from '../../component/uni-popup/uni-popup.vue';
	import {addPostApi} from '../../api/postApi.js';
	import {uploadApi} from '../../api/utilsApi.js';
	import {
		ref,
		onMounted
	} from 'vue';
	import {onBackPress} from '@dcloudio/uni-app';

			let changelookArr = ['所有人可见', "仅自己可见"];
			const yinshi = ref(0)
			const text = ref("")
			const imgList = ref([])
			const popup = ref();
			const flag = ref(false)
			
			onMounted(()=>{
				popup.value.open("center")
			})
			
			onBackPress(()=>{
				if(text.value.length<=0&&imgList.value.length<=0){
					return false;
				}
				if(flag.value) return;
				save();
				return true;
				
			})
			
			function upload(images){
				images.forEach(item=>{
					uploadApi(item).then(res=>{
						imgList.value.push(res.imageId);
					}).finally(()=>{
						
					})
				})
				
				
			}
			
			// 改变对话框
			function change(e){
				console.log(e)
			}
			
			
			function save(){
				uni.showModal({
					content:"是否要保存信息",
					cancelText:"不保存",
					confirmText:"保存",
				}).then(res=>{
					if(res.config){
						
					}else {
						
					}
					flag.value = true;
					uni.navigateBack(1)
				})
			}
			
			// 返回事件
			function back(e) {
				uni.navigateBack(1)
			}
			
			//发布事件
			function submit() {
				if(flag.value){
					return;
				}
				flag.value=true;
				let data =  {
			   content: text.value,
			   images: imgList.value,
			   isopen: yinshi.value,
			   postClassId: 1
				}
				console.log(data)
				addPostApi(data).then(res=>{
					uni.navigateBack()
				})
			}
			// 标题改变事件
			async function changelook() {
				const res = await uni.showActionSheet({
					itemList: ['所有人可见', "仅自己可见"]
				}).catch(e=>{
					flag.value=false;
				});
				yinshi.value = res.tapIndex;
			}
			
	
</script>

<style scoped lang="scss">
	
	@mixin flex {
		/* #ifndef APP-NVUE */
		display: flex;
		/* #endif */
		flex-direction: column;
	}
	
	.uni-textarea {
		border: 1upx solid #EEEEEE;
	}
	
	
	.popup-content {
		@include flex;
		align-items: center;
		justify-content: center;
		padding: 40upx;
		background-color: #fff;
		& image {
			width: 30%;
		}
		&>*{
			margin: 10upx 0;
		}
		&>.popup-texts {
			@include flex;
			text-align: left;
			font-size: 26upx;
		}
		&>button {
			width: 100%;
			font-size: 26upx;
		}
	}
	
</style>
